<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>测试</title>
    <link rel="stylesheet" type="text/css" href="/static/admin/layui/css/layui.css"/>
    <link rel="stylesheet" type="text/css" href="/static/admin/css/admin.css"/>
</head>
<body>
    <form class="layui-form" style="width: 90%;padding-top: 10px;">
        <div class="layui-form-item layui-form-text">
            <label class="layui-form-label">名称：</label>
            <div class="layui-input-block">
                <input type="text" name="routeName" required lay-verify="required" placeholder="请输入名称"
                       autocomplete="off" class="layui-input">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">性别: </label>
            <div class="layui-input-block">
                <input type="radio" name="sex" value="男" title="男">
                <input type="radio" name="sex" value="女" title="女" checked>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">省</label>
            <div class="layui-input-block">
                <select name="province" id="province" lay-filter="Pfilter">
                    <option value="">--请选择--</option>
                </select>
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">市</label>
            <div class="layui-input-block">
                <select name="city" id="city">
                    <option value="">--请选择--</option>
                </select>
            </div>
        </div>
    </form>
<script src="/static/admin/layui/layui.js" type="text/javascript" charset="utf-8"></script>
<script>
    layui.use(['jquery', 'form'], function () {
        var form = layui.form(),
            $ = layui.jquery;
        $.ajax({
            type: "GET",
            url: "/admin/Test/getP",
            dataType: "json",
            success: function (res) {
                var ops = '<option value="">--请选择--</option>';
                for (var province of res.data) {
                    ops += '<option value="' + province.pid + '">' + province.pname + '</option>';
                }
                $('#province').html(ops);
                form.render();
                form.on('select(Pfilter)',function() {
                    var p = $('#province').val();
                    alert(p)
                    $.ajax({
                        type: "GET",
                        url: "/admin/Test/getC",
                        data: {"Pid": p},
                        dataType: "json",
                        success: function (res1) {
                            var ops1 = '<option value="">--请选择--</option>';
                            for (var city of res1.data) {
                                ops1 += '<option value="' + city.cid + '">' + city.cname + '</option>';
                            }
                            $('#city').html(ops1);
                            form.render();

                        }
                    })
                })
            }
        });

    });
</script>
</body>
</html>